<template>
  <div class="page gatheringAccountDel new-form-list">
    <div class="scroll-view">
      <customHeader middleTitle="查看变更收款账号"/>
      <div class="page-body">
        <!-- <div class="status-tip" v-if="data.changeStatus==1" v-html="">{{data.failMsg}}</div> -->
        <div class="status-tip" v-if="data.changeStatus==1" v-html="data.failMsg"></div>
        <div class="bg-ct account-info" style="margin:0;">
          <div class="row">
            <span class="label">账户类型</span>
            <span class="val">{{accountTypeFormate(data.accountType)}}</span>
          </div>
          <div class="row" v-if="data.accountType=='01'&&data.merchantType!='01'">
            <span class="label">结算账户</span>
            <span class="val">{{settleAccountsTypeFormate(data.settleAccountsType)}}</span>
          </div>
          <div
            class="row"
            v-if="!(data.accountType=='01'&&data.merchantType=='02')&&data.merchantType!='01'"
          >
            <span class="label">开户许可证照片</span>
            <span class="val">
              <img :src="imgUrl(data.yzIndustryLicensePhoto)" alt>
            </span>
          </div>
          <div class="row" v-if="data.settleAccountsType==2&&data.merchantType!='01'">
            <span class="label">非法人结算证明照片</span>
            <span class="val">
              <img :src="imgUrl(data.yzImgUnincorporated)" alt>
            </span>
          </div>
          <div class="row">
            <span class="label">开户名</span>
            <span class="val">{{data.bankCertName}}</span>
          </div>
          <template
            v-if="data.accountType=='01'&&data.settleAccountsType==2&&data.merchantType!='01'"
          >
            <div class="row">
              <span class="label">身份证号</span>
              <span class="val">{{data.certNo}}</span>
            </div>
            <div class="row">
              <span class="label">身份证有效期</span>
              <span
                class="val"
              >{{data.merchantIdExpireStart&&data.merchantIdExpire?this.changeMoment(data.merchantIdExpireStart)+"~"+this.periodToDate(data.merchantIdExpireStart,data.merchantIdExpire):""}}</span>
            </div>
            <div class="row">
              <span class="label">结算人身份证正面</span>
              <span class="val">
                <img :src="imgUrl(data.yzImgPrivateIdcardA)" alt>
              </span>
            </div>
            <div class="row">
              <span class="label">结算人身份证背面</span>
              <span class="val">
                <img :src="imgUrl(data.yzImgPrivateIdcardB)" alt>
              </span>
            </div>
          </template>
          <div class="row">
            <span class="label">银行账号</span>
            <span class="val">{{data.bankCardNo}}</span>
          </div>
          <div class="row">
            <span class="label">开户银行</span>
            <span class="val">{{data.bankCode}}</span>
          </div>
          <div class="row">
            <span class="label">开户行所在地区</span>
            <span
              class="val"
            >{{data.branchProvinceName?data.branchProvinceName+"-"+data.branchCityName:""}}</span>
          </div>
          <div class="row">
            <span class="label">支行名称</span>
            <span class="val">{{data.branchName}}</span>
          </div>

          <div class="row">
            <span class="label">联行号</span>
            <span class="val">{{data.contactLine}}</span>
          </div>
          <div class="row" v-if="data.accountType=='01'">
            <span class="label">银行卡正面照</span>
            <span class="val">
              <img :src="imgUrl(data.yzImgBankcardA)" alt>
            </span>
          </div>
          <div class="row">
            <span class="label">银行预留手机号</span>
            <span class="val">{{data.accountPhone}}</span>
          </div>
        </div>
      </div>
      <div class="btn-fixed" @click="toChange">重新变更</div>
    </div>
  </div>
</template>
<script>
import Vue from "vue";
import customHeader from "../../components/header/header";
import { Field, Toast, MessageBox, Button } from "mint-ui";
import jsBridge from "../../tools/jsBridge";
import AwesomePicker from "vue-awesome-picker";
import config from "../../base/profile/config.json";
import shopService from "../../js/shopService.js";
import moment from "moment";
export default {
  name: "gatheringAccountDel",
  data() {
    return {
      //变更状态字段（changeStatus）
      // INIT(0,"初始状态"),
      // FAILURE(1,"失败"),
      // AUDITING(2,"审核中"),
      // SUCCESS(3,"成功")
      data: {}
    };
  },
  methods: {
    //使用年限和日期转换
    periodToDate(start,deal){
      const startDate = moment(start).format('YYYY-MM-DD');
      if(startDate && deal){
        if(deal == '29991231'){
          return '长期'
        }else{
          return moment(startDate.replace(/-/g,"/")).add(deal,'years').format('YYYY-MM-DD');
        }
      }
      return
    },
    changeMoment(date){
      return moment(date).format('YYYY-MM-DD')
    },
    //跳转去变更页面
    toChange() {
      this.$router.push({
        path:
          "/storeManage/gatheringManage/gatheringAccountDel/changeSettlementAccount",
        query: {
          shopId: this.data.shopId,
          merchantId: this.data.merchantId,
          mType:this.$route.query.mType,
          failChange: "1",
          merchantIdSame: this.$route.query.merchantIdSame,
          source:1//从结算变更详情跳转到结算帐号变更页
        }
      });
    },
    imgUrl(url) {
      return config.previewUrlPrefix + "" + url;
    },
    //账号类型
    accountTypeFormate(accountType) {
      let r = "";
      if (accountType == "01") {
        r = "对私账户";
      } else if (accountType == "02") {
        r = "对公账户";
      }
      return r;
    },
    //结算账户
    settleAccountsTypeFormate(settleAccountsType) {
      let r = "";
      if (settleAccountsType == 1) {
        r = "法人";
      } else if (settleAccountsType == 2) {
        r = "非法人";
      }
      return r;
    },
    initModel() {
      let changeModel = sessionStorageClient.getJSON("changeModel");
      if (!changeModel) {
        Toast("未获取到信息");
        this.$router.back();
      } else {
        this.data = changeModel;
        this.data.merchantType = this.$route.query.mType;
        this.data.merchantId = this.$route.query.merchantId;
        this.data.settleAccountsType = this.$route.query.settleAccountsType;
      }
    }
  },
  created() {
    this.initModel();
  },
  components: {
    customHeader
  }
};
</script>
  <style lang='scss' scoped>
@import "gatheringAccountDel";
</style>
